var swiper = new Swiper('.swiper-container',{
	direction : 'vertical',
	followFinger : false,
	speed:800,
	mousewheel: true,
	pagination : {
		el:'.swiper-pagination',
		clickable: true,
	},
	on:{
		init:function(swiper){
	        slide=this.slides.eq(0);
		    slide.addClass('ani-slide');
	    },
		transitionStart: function(){
		    for(i=0;i<this.slides.length;i++){
		    	slide=this.slides.eq(i);
		        slide.removeClass('ani-slide');
			}
	    },
		transitionEnd: function(){
			slide=this.slides.eq(this.activeIndex);
		    slide.addClass('ani-slide');
			
	    },
	}
});


var btns = document.querySelectorAll(".btns button")
for(let i = 0;i<btns.length;i++){
	btns[i].index=i
	btns[i].onclick=function(){
		// console.log(i)
		var btnsYes = document.querySelectorAll(".btns .Yes")
		this.classList.add("Yes")
		for(let j = 1;j<=btnsYes.length;j++){
			console.log(this.index-3)
			var asa = this.index-3;
			btnsYes[btnsYes.length-asa].classList.remove("Yes")
		}
	}
}


var yuan = document.querySelectorAll(".Z-date i")
var yuanLi1 = document.querySelectorAll(".Z-date li")
var yuanLi2 = document.querySelectorAll(".Z-work li")
function ou(a,b){
	for(let i = 0;i<a.length;i++){
		a[i].onmouseover=function(){
			b[i].classList.add("active")
		}
		a[i].onmouseout=function(){
			b[i].classList.remove("active")
		}
	}
}
ou(yuanLi1,yuan)
ou(yuanLi2,yuan)

var coudLi = document.querySelectorAll(".coud li")
var coudI = document.querySelector(".inner .box i")
for(let i =0;i<coudLi.length;i++){
    coudLi[i].onclick=function(){
        coudI.innerText=this.innerText
    }
}
var ZDate = document.querySelectorAll(".Z-date li")
var ZWork = document.querySelectorAll(".Z-work li")
function demo(a){
    setInterval(function(){
        if(coudI.innerText=="2018"){
            a[0].className = 'active'
            a[1].className = 'active'
            a[2].className = ''
        }else if(coudI.innerText=="2019"){
            a[0].className = ''
            a[1].className = ''
            a[2].className = 'active'
        }
    },1000)
}
demo(ZDate)
demo(ZWork)


function das(a,b,c){
    var carousel=document.querySelector(b);
    var carouselImg=carousel.querySelectorAll('img');
    var carouselTxt = document.querySelectorAll(".carousel a .txtIcon")
    //文字
    var pagerArr = ["本网站","堆糖","优易论文","表白页面","腾讯新闻","本网站","机械师官网","天涯明月刀","奔驰官网","网页模板","京东官网","机械师官网"];
    for(let i = 0;i<carouselTxt.length;i++){
        carouselTxt[i].innerText = pagerArr[i]
    }
    var pager = document.querySelector(c);
    var border=document.querySelector(a);
    //生成小图标
    for(var i = 0;i<carouselImg.length;i++){
        var a = document.createElement("a")
        a.href="javascript:;"
        a.className="thumb"+(i+1)
        var img = document.createElement("img")
        img.src=carouselImg[i].src;
        img.width="50";
        a.appendChild(img)
        pager.appendChild(a)
    }
    carousel.appendChild(carousel.firstElementChild.cloneNode(true));
    var carouselBtn=pager.querySelectorAll('a');
    carousel.style.height=carouselImg.length*carouselImg[0].offsetHeight+'px';
    var index=0;
    var xh=null;
    function autoPlay(){
        xh=setInterval(function(){
            if(index==-5){
                //给上一个原点背景改为白色
                carouselBtn[0].classList.remove("selected");
            }else{
                //给上一个原点背景改为白色
                carouselBtn[-index].classList.remove("selected");
            }
            index--;
            if(index==-6){
                index=-1;
                carousel.style.top='0px';
            }
           run(index*carouselImg[0].offsetHeight);
           if(index==-5){
               carouselBtn[0].classList.add("selected");
           }else{
               //给下一个原点背景改为红色
                carouselBtn[-index].classList.add("selected");
           }
        },3000);
    }
    autoPlay();
    var running=null;
    function run(num){
        clearInterval(running);
        running=setInterval(function(){
            //先算目标值与当前值得差距  /10
            var height=(num-carousel.offsetTop)/10;
            height=height>0?Math.ceil(height):Math.floor(height);
            //给ul的top赋值  =  当前值 + 本次移动的距离
            carousel.style.top=carousel.offsetTop+height+'px';
        },1000/40);
    }
    border.onmouseover=function(){
        clearInterval(xh);
    }
    border.onmouseout=function(){
        autoPlay();
    }
    //遍历小圆点  给每一个添加一个点击
    for(var i=0; i<carouselBtn.length;i++){
        //给每一个小圆点添加一个属性  属性值就是下标  这也是 原点与图片之间的关联所在
        carouselBtn[i].abc=i;
        carouselBtn[0].classList.add("selected")
        carouselBtn[i].onclick=function(){
            console.log(this.abc);
            //遍历清楚每一个圆点的背景
            for(var j=0;j<carouselBtn.length;j++){
                carouselBtn[j].classList.remove("selected");
            }
            this.classList.add("selected");
            run(-this.abc*carouselImg[0].offsetHeight);
            //让index=当前li的下标  那么下一次执行就会播放下一张   而不是上一张了
            index=-this.abc;
        }
    }
}
das(".left",".left .carousel",".left .pager")
das(".right",".right .carousel",".right .pager")

var iconIcon = document.querySelectorAll(".lian-lo .icon")
var iconImg = document.querySelectorAll(".lian-lo .icon span");
for(let i = 0;i<iconIcon.length;i++){
    iconIcon[i].index=i
    iconIcon[i].onmouseover=function(){
        iconImg[i].style.zIndex = '1'
    }
    iconIcon[i].onmouseout=function(){
        iconImg[i].style.zIndex = '-1'
    }
}


var swiperSlider = document.querySelectorAll(".swiper-slide")
var swiperMask = document.querySelectorAll(".swiper-slide .Mask")
for(let i = 1;i<swiperSlider.length;i++){
    swiperSlider[i].removeChild(swiperMask[i]);
}